<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>智慧物流数字看板</title>
    <link rel="icon" href="../static/img/index/icon.png">
    <link rel="stylesheet" href="../static/js/layui/css/layui.css">
    <link rel="stylesheet" href="../static/css/index.css">
    <link rel="stylesheet" href="../static/css/animate.min.css">
    <link rel="stylesheet" href="../static/css/table.css">

</head>

<body>
    <div class="app">
        <div class="header">
            <div class="header-title">
                <img class="header-icon" src="../static/img/index/icon.png">
                智慧物流数字看板</div>
            <div class="header-menu">
                <div class="h-m-item active">智慧物流数字看板</div>
                <div class="h-m-item">屠宰牛只统计</div>
                <div class="h-m-item">库存报表统计</div>
                <div class="h-m-item">销售订单报表统计</div>
                <div class="h-m-item">质量追溯表统计</div>
            </div>
            <div class="logout">
                <img class="changePwd" onclick=changePwd() src="../static/img/user.png" title="修改密码"><img
                    src="../static/img/logout.png" onclick="logout()" title="注销">
            </div>
        </div>
        <div class="load-box" style="display: flex;">
            <div>
                <img class="layui-anim layui-anim-rotate layui-anim-loop" src="../static/img/index/load.png"
                    alt="">
            </div>
            <span>智慧看板数据生成中，请稍后. . .</span>
        </div>
        <div class="box">
            <div class="box-left">
                <div class="box-map">

                    <div class="map-size map-left">
                        <div>
                            <input name="size" type="radio" value="1.2" class="marker-size">大
                        </div>
                        <div>
                            <input name="size" type="radio" value="0.9" class="marker-size" checked="checked" />中
                        </div>
                        <div>
                            <input name="size" type="radio" value="0.6" class="marker-size" />小
                        </div>
                    </div>
                    <div class="map-switch map-left">
                        <div class="map-s-detail">
                            <div class="map-s-d-title">
                                <img src="../static/img/index/i11.png" alt="">
                                今日订单
                            </div>
                            <div class="map-s-d-msg">
                                <div class="box6">
                                    <div class="box6-item">
                                        <div>
                                            <div class="box6-title">订单总数</div>
                                            <div class="box6-count">101</div>
                                        </div>
                                        <img src="../static/img/oneMap/i6.png" alt="">

                                    </div>
                                    <div class="box6-item">
                                        <div>
                                            <div class="box6-title">正在配送</div>
                                            <div class="box6-count">62</div>
                                        </div>
                                        <img src="../static/img/oneMap/i5.png" alt="">
                                    </div>
                                    <div class="box6-item">
                                        <div>
                                            <div class="box6-title">待配送</div>
                                            <div class="box6-count">28</div>
                                        </div>
                                        <img src="../static/img/oneMap/i4.png" alt="">
                                    </div>
                                    <div class="box6-item">
                                        <div>
                                            <div class="box6-title">已完成</div>
                                            <div class="box6-count">21</div>
                                        </div>
                                        <img src="../static/img/oneMap/i4.png" alt="">
                                    </div>

                                </div>
                            </div>
                        </div>
                        <div class="box-right">
                            <div class="list-title">派送中订单</div>
                            <div class="box-list">
                                <div class="list-item">
                                    <div>
                                        <div class="l-i-sub"> 客户名称：幸福路小学</div>
                                        <div class="l-i-title">地址：安徽省阜阳市临泉县幸福路186号城南街道中心学校</div>
                                        <div class="l-i-address">收件人：吴磊（16985458875）</div>
                                        <div class="l-i-address">派送车辆：皖 K0C867</div>
                                    </div>
                                    <div class="l-i-status">
                                        <div>
                                            <img src="../static/img/firemap/i8.png" alt="">
                                            <div class="l-i-status-text">1.7KM</div>
                                        </div>
                                        <div>
                                            <img class="fly-icon" src="../static/img/index/重点单位.png" title="定位"
                                                onclick="positioningToFire(115.274928, 33.045224)">
                                        </div>
                                    </div>
                                </div>
                                <div class="list-item">
                                    <div>
                                        <div class="l-i-sub"> 客户名称：城中路小学</div>
                                        <div class="l-i-title">地址：阜阳市临泉县城中南路晶宫天悦东侧约120米</div>
                                        <div class="l-i-address">收件人：张立坤（17945458875）</div>
                                        <div class="l-i-address">派送车辆：皖 K16Z55</div>
                                    </div>
                                    <div class="l-i-status">
                                        <div>
                                            <img src="../static/img/firemap/i8.png" alt="">
                                            <div class="l-i-status-text">2.6KM</div>
                                        </div>
                                        <div>
                                            <img class="fly-icon" src="../static/img/index/重点单位.png" title="定位"
                                                onclick="positioningToFire(115.274928, 33.045224)">
                                        </div>
                                    </div>
                                </div>
                                <div class="list-item">
                                    <div>
                                        <div class="l-i-sub"> 客户名称：智慧小学</div>
                                        <div class="l-i-title">地址：安徽省阜阳市临泉县经济开发区中国石化加油站对面200米处</div>
                                        <div class="l-i-address">收件人：王辉（15689547785）</div>
                                        <div class="l-i-address">派送车辆：皖 K99R96</div>
                                    </div>
                                    <div class="l-i-status">
                                        <div>
                                            <img src="../static/img/firemap/i8.png" alt="">
                                            <div class="l-i-status-text">2.9KM</div>
                                        </div>
                                        <div>
                                            <img class="fly-icon" src="../static/img/index/重点单位.png" title="定位"
                                                onclick="positioningToFire(115.274928, 33.045224)">
                                        </div>
                                    </div>
                                </div>
                                <div class="list-item">
                                    <div>
                                        <div class="l-i-sub"> 客户名称：顺河街小学</div>
                                        <div class="l-i-title">地址：安徽省阜阳市临泉县顺河街50号</div>
                                        <div class="l-i-address">收件人：李凯（17365895587）</div>
                                        <div class="l-i-address">派送车辆：皖 K303A3</div>
                                    </div>
                                    <div class="l-i-status">
                                        <div>
                                            <img src="../static/img/firemap/i8.png" alt="">
                                            <div class="l-i-status-text">3.7KM</div>
                                        </div>
                                        <div>
                                            <img class="fly-icon" src="../static/img/index/重点单位.png" title="定位"
                                                onclick="positioningToFire(115.274928, 33.045224)">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="map-car-count map-left">
                        <div class="map-count-item">
                            <div>车辆总数<span style="color: aqua;">24</span></div>
                            <div>正在配送<span style="color: rgb(252, 142, 40);">15</span></div>
                        </div>
                    </div>
                    <div class="map-pop map-left">
                        <div class="map-title" style="border-bottom: 1px solid #739bac;">近30天客户订单配送统计</div>
                        <div class="map-pop-box" id="count-ranking">

                        </div>
                    </div>
                    <div class="map-car map-left">

                    </div>
                    <div class="map-tool map-left">
                        <div class="map-tool-item" data-value="marker">
                            <img src="../static/img/index/t1.png">
                            地图标注
                        </div>
                        <div class="map-tool-item" data-value="rule">
                            <img src="../static/img/index/t2.png">
                            距离测量
                        </div>
                        <div class="map-tool-item" data-value="area">
                            <img src="../static/img/index/t3.png">
                            面积测量
                        </div>
                        <div class="map-tool-item" data-value="polyline">
                            <img src="../static/img/index/t9.png">
                            路径绘制
                        </div>
                        <div class="map-tool-item" data-value="circle">
                            <img src="../static/img/index/t4.png">
                            圆形绘制
                        </div>
                        <div class="map-tool-item" data-value="polygon">
                            <img src="../static/img/index/t5.png">
                            多边形绘制
                        </div>
                        <div class="map-tool-item" data-value="clear">
                            <img src="../static/img/index/t6.png">
                            清除绘制
                        </div>
                        <div class="map-tool-item" data-value="screenshot">
                            <img src="../static/img/index/t7.png">
                            看板保存
                        </div>
                        <div class="map-tool-item" data-value="init">
                            <img src="../static/img/index/t8.png">
                            初始化
                        </div>
                        <div class="map-tool-config" style="display: none;">
                            <div>
                                <img src="../static/img/index/i9.png" alt="">
                                <div class="t-c-item">
                                    <input class="layui-input" id="silder-value" type="text" placeholder="自定义标注文字,默认为空">
                                </div>
                            </div>
                            <div>
                                <img src="../static/img/index/i10.png" alt="">
                                <div class="t-c-item">
                                    <div id="silder"></div>
                                    <img class="silder-icon" src="../static/img/index/i4.png">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="m-switch">
                        <div class="layers-switch" data-type="1">
                            <img src="../static/img/firemap/m1.png" title="默认">
                        </div>
                        <div class="layers-switch active" data-type="3">
                            <img src="../static/img/firemap/m3.png" title="黑夜模式">
                        </div>
                        <div class="layers-switch" data-type="2">
                            <img src="../static/img/firemap/m2.png" title="卫星模式">
                        </div>
                    </div>
                    <div class="map">
                        <div id="mapContainer"></div>
                    </div>
                </div>
            </div>
            <div class="panel">
                <div id="panel"></div>
            </div>
        </div>
    </div>
    <div class="map-window" style="display: none;">
        <div class="map-window-content">
            <img id="close-map-window" src="../static/img/close1.png" alt="">
            <div class="map-window-title map-title">
                <span id="map-title"></span>
            </div>
            <div class="map-window-body">
                <div class="map-window-top">
                    <div class="window-top-left window-block">
                        <img src="../static/img/icon18.png">
                        <div class="top-count">
                            <div>当前状态</div>
                            <div class="top-temp">

                            </div>
                        </div>
                        <div class="top-trend">
                            <div>
                                <div>温度</div>
                                <div style="color: #00b7ff;">1.6℃</div>
                            </div>
                            <div>
                                <div>湿度</div>
                                <div style="color: #00b7ff;">72%</div>
                            </div>
                        </div>
                    </div>
                    <div class="window-top-right window-block">
                        <img src="../static/img/icon19.png">
                        <div class="top-count">
                            <div>今日订单总数</div>
                            <div>
                                <span style="color: #11ffd7;">9</span>
                            </div>
                        </div>
                        <div class="top-trend">
                            <div>
                                <div>待配送</div>
                                <div style="color: #aaaaaa;">4</div>
                            </div>
                            <div>
                                <div>已完成</div>
                                <div style="color: #29ebff;">5</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="map-window-middle">
                    <div class="window-middle-left window-block window-border">
                        <div class="window-title">
                            当前配送订单
                        </div>
                        <div class="window-chart">
                            <div class="map-pop-box">
                                <div class="pop-box-li">
                                    <img src="../static/img/firemap/i8.png" alt="">
                                    智慧小学配送订单
                                </div>
                                <div class="pop-box-li">订单编号：<span>BL250915338</span></div>
                                <div class="pop-box-li">预估时间：<span>7分钟</span></div>
                                <div class="pop-box-li">驾驶员：<span>李建国（18954859952）</span></div>
                                <div class="pop-box-li">订单明细：<span>牛腿肉10KG，牛腱子16KG</span></div>
                                <div class="pop-box-tool">
                                    <div onclick="getRoute({lat: 33.067714,lng: 115.258807})">路线查询</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="window-bottom-left window-block window-border">
                        <div class="window-title">
                            今日配送订单
                        </div>
                        <div class="window-chart" id="casualtiesListChart"></div>
                    </div>

                </div>
                <div class="map-window-bottom">
                    <div class="window-middle-right window-block window-border">
                        <div class="window-title">
                            车厢温湿度趋势
                        </div>
                        <div class="window-chart" id="window-trend"></div>
                    </div>
                    <div class="window-bottom-right window-block window-border">
                        <div class="window-title">
                            近七天订单配送次数趋势
                        </div>
                        <div class="window-chart" id="overviewChart"></div>
                    </div>
                </div>
            </div>

        </div>

    </div>
    <script type="text/html" id="map-tool">
    <div>
        <img src="../static/img/index/i9.png" alt="">
        <div class="t-c-item">
            <input class="layui-input" id="silder-value" type="text" placeholder="自定义标注文字,默认为空">
        </div>
    </div>
    <div>
        <img src="../static/img/index/i10.png" alt="">
        <div class="t-c-item">
            <div id="silder"></div>
            <img class="silder-icon" src="../static/img/index/i4.png">
        </div>
    </div>
    </script>
    <script type="text/javascript">
        window._AMapSecurityConfig = {
            securityJsCode: '0352ef3b4bf385d3595458bebc1fe065',
        }
    </script>
    <script
        src="https://webapi.amap.com/maps?v=2.0&key=a9adc73d0d44c6cc9b1d8af08fa51d72&plugin=AMap.GeoJSON,AMap.MarkerCluster,AMap.Driving,AMap.MouseTool"></script>
    <script src="https://webapi.amap.com/loca?v=2.0.0&key=a9adc73d0d44c6cc9b1d8af08fa51d72"></script>
    <script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
    <script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
    <script type="text/javascript" src="../static/js/util/jquery.min.js"></script>
    <script type="text/javascript" src="../static/js/biz/app.js"></script>
    <script type="text/javascript" src="../static/js/util/echarts.min.js"></script>
    <script type="text/javascript" src="../static/js/util/html2canvas.min.js"></script>
    <script type="text/javascript" src="../static/js/layui/layui.js"></script>
    <script type="text/javascript" src="../static/js/biz/index.js"></script>
    <script type="text/javascript" src="../static/js/util/tween.umd.js"></script>

</body>

</html>